<!--
 * @Author: wjk
 * @Date: 2020-08-19 10:51:37
 * @LastEditors: wjk
 * @LastEditTime: 2020-08-25 14:46:03
 * @description: file content
-->
<template>
  <view class="box-modal" :class="{active: visible}">
    <view class="modal-content">
      <view class="title">{{ title }}</view>
      <view v-if="contentList.length" class="content-list">
        <view class="line-left"></view>
        <view v-for="(item, index) in contentList" :key="index" class="content-item">
          {{ item }}
        </view>
      </view>
      <view v-else class="content"><text>{{ content }}</text></view>
      <view class="btn" @click="closeModal">{{ btnText }}</view>
    </view>
  </view>
</template>
<script>
import './index.scss'
export default {
  name: 'BoxModal',
  props: {
    title: { type: String, default: '' },
    content: { type: String, default: '' },
    contentList: { type: Array, default: () => [] },
    btnText: { type: String, default: '我知道了' }
  },
  data() {
    return {
      visible: false
    }
  },
  methods: {
    show() {
      this.visible = true
    },
    closeModal() {
      this.visible = false
      this.$emit('close')
    }
  }
}
</script>
